{% extends 'base.html' %}
{% block body %}
    <div class="container">
    <h3 class="text-primary">
       标题： {{ post.title }}
    </h3>
    <h4>作者：
        <a href="{{ url_for('blog.about',user_id=author.id) }}">{{ author.username }}</a>
        {% if current_user.is_authenticated %}
            <button type="button" id="follow_btn" onclick="follow();">{{ follow_type }}</button>
        {% else %}
            <button type="button" id="follow_btn" onclick="follow();">+关注</button>
        {% endif %}
    </h4>
    <h5 class="text-primary">
       发布时间 {{ moment(post.timestamp).fromNow(refresh=True) }}
    </h5>
    <p class="text-primary">
       文章内容： {{ post.body|striptags }}
    </p>
    {% if current_user.is_authenticated %}
    <form class="form-group" method="post"
          action="{{ url_for('blog.write_comment',username=current_user.username,post_id=post.id) }}">
    {{ form.csrf_token }}
        <div class="mb-3">
        <label class="form-label">写下你的评论</label>
        {{ form.body(class="form-control") }}
        {{ form.submit(class="form-btn") }}
    </div>
    </form>
    {% else %}
    <div>
        <a class="btn" type="button" href="{{ url_for('auth.login') }}">
            评论请先登陆
        </a>
    </div>
    {% endif %}
        <h4>Comments</h4>
        <div class="list-group">
        {% for comment,user in result %}
            <div class="d-flex w-100 justify-content-between">
                <h5 class="mb-1 text-primary">
                    <a href="{{ url_for('blog.about',user_id=user.id) }}"><img style="width: 40px;height: 40px;" src="{{ url_for('static',filename='avatars/'+user.avatar_s) }}"></a>
                    <a href="{{ url_for('blog.about',user_id=user.id) }}">{{ user.username }}</a>
                <small class="text-muted">#{{ loop.revindex }}</small>
                </h5>
                <small>
                    {{ moment(post.timestamp).fromNow(refresh=True) }}
                </small>
            </div>
            <p class="mb-1">{{ comment.body|striptags }}</p>
        {% endfor %}
        </div>
    </div>
{% endblock %}
{% block script %}
    <script type="text/javascript">
        function follow(){
            var btn=$('#follow_btn');

            {% if not current_user.is_authenticated %}
                alert("登陆才能关注");
            {% else %}
                var follow_id={{ current_user.id }};
                var followed_id={{ author.id }};
            {% endif %}
                if (btn.text()=='+关注'){
                   $.ajax({
                    url:"{{ url_for('blog.follow') }}",
                    type:'post',
                    data:{'follow_id':follow_id,'followed_id':followed_id,'type':'+'},
                    success:function (data) {
                        btn.text('已关注');
                    }
                    });
                }
                else {
                    $.ajax({
                    url:"{{ url_for('blog.follow') }}",
                    type:'post',
                    data:{'follow_id':follow_id,'followed_id':followed_id,'type':'-'},
                    success:function (data) {
                        btn.text('+关注');
                    }
                    });
                }
            }
    </script>
{% endblock %}